<template>
  <div>
    <!-- <div>home</div> -->
    <home-header :city="city"></home-header>
    <home-swiper :NewSwiperList="SwiperList"></home-swiper>
    <nav-icon :Newlist="NewiconList" ref="NavIcon"></nav-icon>
    <home-recommend :NewRecomList="RecomList"></home-recommend>
    <home-quna :NewImgList="imgList"></home-quna>
  </div>
</template>

<script>
import HomeHeader from './components/Header'
import HomeSwiper from './components/Swiper'
import NavIcon from './components/NavIcon'
import HomeRecommend from './components/Recommend'
import HomeQuna from './components/QuNa'
import axios from 'axios'

export default {
  name: 'Home',
  components: {
    HomeHeader,
    HomeSwiper,
    NavIcon,
    HomeRecommend,
    HomeQuna
  },
  data () {
    return {
      NewiconList: [],
      city: '北京',
      SwiperList: [],
      imgList: [],
      RecomList: []
    }
  },
  methods: {
    getHomeInfo () {
      axios.get('/static/mock/index.json')
        .then((res) => {
          if (res.status === 200 && res.data) {
            this.NewiconList = res.data.iconList
            this.SwiperList = res.data.swiperList
            this.imgList = res.data.imgList
            this.RecomList = res.data.RecomList
          }
        })
    },
    getUrlKey: function () {
      if (this.$route.params.textCity) {
        this.city = this.$route.params.textCity
      }
    }
  },
  mounted () {
    this.getHomeInfo()
    this.getUrlKey()
  }
}
</script>

<style scoped>

</style>
